//隐藏高德地图图标
.amap-logo {
    display: none !important;
}

.dn {
    display: none !important;
}

%v-box {
    display: flex !important;
    flex-direction: column;
}
%h-box {
    display: flex !important;
}
%vh-content-center {
    justify-content: center !important;
}

%vh-content-between {
    justify-content: space-between !important;
}

%vh-content-around {
    justify-content: space-around !important;
}

%vh-content-start {
    justify-content: flex-start !important;
}

%vh-content-end {
    justify-content: flex-end !important;
}

%vh-items-center {
    align-items: center !important;
}

%vh-items-start {
    align-items: flex-start !important;
}

%vh-items-end {
    align-items: flex-end !important;
}
.v-box {
    @extend %v-box;
}

.h-box {
    @extend %h-box;
}
.f-grow {
    flex-grow: 1;
}
.f-wrap {
    flex-wrap: wrap;
}
.f-shrink-no {
    flex-shrink: 0;
}

.t-center {
    text-align: center;
}
.vh-content-center {
    @extend %vh-content-center;
}
.vh-items-center {
    @extend %vh-items-center;
}
.h-center {
    @extend %h-box, %vh-content-center, %vh-items-center;
}
.v-center {
    @extend %v-box, %vh-content-center, %vh-items-center;
}

.h-between-center {
    @extend %h-box, %vh-content-between, %vh-items-center;
}
.h-between-start {
    @extend %h-box, %vh-content-between, %vh-items-start;
}
.h-start-center {
    @extend %h-box, %vh-content-start, %vh-items-center;
}
.h-start-start {
    @extend %h-box, %vh-content-start, %vh-items-start;
}
.h-start-end {
    @extend %h-box, %vh-content-start, %vh-items-end;
}
.h-end-center {
    @extend %h-box, %vh-content-end, %vh-items-center;
}
.v-between-center {
    @extend %v-box, %vh-content-between, %vh-items-center;
}
.v-between-start {
    @extend %v-box, %vh-content-between, %vh-items-start;
}
.v-start-center {
    @extend %v-box, %vh-content-start, %vh-items-center;
}
.v-end-center {
    @extend %v-box, %vh-content-end, %vh-items-center;
}
.v-center-start {
    @extend %v-box, %vh-content-center, %vh-items-start;
}
.v-start-start {
    @extend %v-box, %vh-content-start, %vh-items-start;
}
.p-r {
    position: relative !important;
}
.p-a {
    position: absolute !important;
    left: 0;
    top: 0;
}
.p-center {
    position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
$unit: 1px;
@for $i from 1 through 100 {
    .w#{$i} {
        width: #{$i + '%'} !important;
    }
    @if $i <= 10 or $i%5 == 0 {
        .m#{$i} {
            margin: $i * $unit !important;
        }
        .p#{$i} {
            padding: $i * $unit !important;
        }
        .mr#{$i} {
            margin-right: $i * $unit !important;
        }
        .ml#{$i} {
            margin-left: $i * $unit !important;
        }
        .mb#{$i} {
            margin-bottom: $i * $unit !important;
        }
        .mt#{$i} {
            margin-top: $i * $unit !important;
        }
        .pr#{$i} {
            padding-right: $i * $unit !important;
        }
        .pl#{$i} {
            padding-left: $i * $unit !important;
        }
        .pb#{$i} {
            padding-bottom: $i * $unit !important;
        }
        .pt#{$i} {
            padding-top: $i * $unit !important;
        }

        .h#{$i} {
            height: #{$i + '%'} !important;
        }
    }
}

@for $i from 4 through 60 {
    @if $i%2 == 0 {
        .f#{$i} {
            font-size: $i * $unit !important;
        }
    }
    @if $i%5 == 0 {
        .br#{$i} {
            border-radius: $i * $unit !important;
        }
    }
}
@for $i from 1 through 8 {
    .fw#{$i} {
        font-weight: $i * 100 !important;
    }
}

@for $i from 1 through 10 {
    .op#{$i} {
        opacity: $i * 0.1 !important;
    }
    .z#{$i} {
        z-index: $i * 1000 !important;
    }
    .fg#{$i} {
        flex-grow: $i !important;
    }
    .circle#{$i} {
        width: $i * 2px !important;
        height: $i * 2px !important;
        border-radius: $i * $unit !important;
        background-color: currentColor;
    }
}

.fr {
    float: right;
}

.fl {
    float: left;
}

.scroll-y {
    height: 100%;
    overflow-y: auto;
}

.tljustify {
    text-align-last: justify;
}

.white {
    color: white !important;
}
.bg-white {
    background-color: white !important;
}
.danger-color {
    color: red;
}
.warning-color {
    color: #faad14;
}
.nowrap {
    white-space: nowrap;
}
.pointer {
    cursor: pointer;
}
.no {
    cursor: not-allowed;
}
.scroll {
    overflow: hidden;
    &:hover {
        overflow: auto;
    }
}
